<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<%@ include file="/WEB-INF/views/include/constrant.jsp"%>
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta content="telephone=no" name="format-detection">
<meta charset="UTF-8">
<title>线路选择</title>
<link rel="stylesheet" href="${ctxStatic }/mui/css/mui.min.css">
<link rel="stylesheet" href="${ctxStatic }/wx/css/tour_charters.css" />
<script src="${ctxStatic }/mui/js/mui.min.js"></script>
<script src="${ctxStatic }/zepto/zepto.min.js"></script>
<style>
		.mui-content,body{
			background: #f5f5f5;
		}
        .result_icos{
        	color: #C8C7CC;
        	font-size: 15px;
        	position: absolute;
        	right: 3%;
        	top: 12px;
	</style>
</head>
<body>
		<div id="tour_charter">
			 <div class="mui-navbar-inner mui-bar mui-bar-nav" style="background: #16C59B;">
				<button type="button" class="mui-left mui-action-back mui-btn  mui-btn-link mui-btn-nav mui-pull-left" style="color: #fff;">
					<span class="mui-icon mui-icon-left-nav"  style="color: #fff;"></span>
				</button>
				<h1 class="mui-center mui-title" style="color: #fff;">线路选择</h1>
			</div>
			<div class="mui-content">
				 <div class="tour_cars">
				  <form style="text-align: center" id="travelRentForm" action="${ctxWx }/rentproduct/getTravelList" method="get">
                         <input type="hidden" name="rentType" value="5"/>
                         <input type="hidden" name="tabType" value="${tRentproduct.tabType }" />
                         <input id="pageNo" name="pageNo" type="hidden" value="1"/>
		                 <input id="pageSize" name="pageSize" type="hidden" value="5"/>
		                 <input type="hidden" name="departcity.siteid" value="${tRentproduct.departcity.siteid }" id="departcity.siteid">
		                 <input id="destination" name="destination" type="hidden" value="${destination }" /> 
		                 <input id="estday" name="estday" type="hidden" value="${day }"/>
		                <input type="hidden" id="departcity_sitename" name="departcity.sitename" value="${tRentproduct.departcity.sitename }" >
				 	      <div class="tourcars_top">
				 	 	   <div class="mui-row">
				 	 	   	     <div class="mui-col-xs-6 tour_days">
				 	 	   	     		<div class="trip_tit_d">
				 	 	   	     		      <span class="trous_lf">旅游天数</span>
				 	 	   	     		      <span class="trous_ri">
				 	 	   	     		  	<c:if test="${not empty day }"> ${day }天  </c:if>  
				 	 	   	     		  	<c:if test="${empty day }">不限</c:if>  
				 	 	   	     		      </span>
				 	 	   	     		      <i class="mui-icon mui-icon-arrowdown result_icos"></i>
				 	 	   	     		</div>
				 	 	   	     	<ul class="trip-list-box">
				 	 	   	     		<li  class="trip_tit_n">
				 	 	   	     			   <span class="trous_lf">旅游天数</span>
				 	 	   	     		      <span class="trous_ri">不限</span>
				 	 	   	     		      
				 	 	   	     		</li>
				 	 	   	     		<c:forEach items="${dayList }" var="daynum" >
				 	 	   	     		<li  class="trip_tit_n">${daynum }天</li>
				 	 	   	     		 </c:forEach>
				 	 	   	     	</ul>
				 	 	   	     </div>
				 	 	   	        	     <div class="mui-col-xs-6 tour_scenic">
				 	 	   	     	 <div class="trip_tit_d">
				 	 	   	     		         <span class="trous_lf">旅游景点</span>
				 	 	   	     		         <span class="trous_ri">
				 	 	   	     		    <c:if test="${not empty destination }"> ${destination }</c:if>  
				 	 	   	     		  	<c:if test="${empty destination }">不限</c:if> 
				 	 	   	     		         </span>
				 	 	   	                   	  	<i class="mui-icon mui-icon-arrowdown result_icos"></i>
				 	 	   	     		 </div>
                                       <ul class="trip-list-box">
				 	 	   	     		  
				 	 	   	     		 <li  class="trip_tit_m">
				 	 	   	     		 	   <span class="trous_lf">旅游景点</span>
				 	 	   	     		       <span class="trous_ri">不限</span>
				 	 	   	     		
				 	 	   	     		 </li>
				 	 	   	     		 <c:forEach items="${allSiteList }" var="sites">
				 	 	   	     		<li  class="trip_tit_m">${sites }</li>
				 	 	   	     		</c:forEach>
				 	 	   	     	</ul>
				 	 	        </div>
				 	 	   	    </div>
				 	 </div>
				</form>
				 	 </div>
				 	 <div class="tourc_bottom">
				 	 	<ul class="mui-table-view">
				 	 	<c:if test="${not empty page.list }">
				 	 		<c:forEach items="${page.list }" var="rentgroup">
				 	 	        <li class="mui-table-view-cell" value="${ctxWx }/rentproduct/getTravelDetail?rentgrpid=${rentgroup.rentgrpid}
				 	 		&departcity=${rentgroup.departcity.siteid }&destcity=${rentgroup.destcity.siteid }
				 	 		&linename=${rentgroup.tLine.linename }&lowestPrice=${rentgroup.lowestPrice } 
				 	 		&linepic=${rentgroup.tLine.linepic }&daysnum=${rentgroup.daysnum }">
				 	 	            <div class="tourc_img">
				 	 	            	<img src="https://www.xiakeyueche.com${rentgroup.tLine.linepic }" />
				 	 	            </div>
				 	 	            <div class="mui-row tourc_txt">
				 	 	            	<div class="mui-col-xs-9">
				 	 	            		 <p>${rentgroup.productname } </p>
				 	 	            	</div>
				 	 	            	<div class="mui-col-xs-3">
				 	 	            		<span>￥
				 	 	            		<fmt:formatNumber type="number" value="${rentgroup.lowestPrice }" pattern="0" maxFractionDigits="0"/>
				 	 	            		起 </span>
				 	 	            	</div>
				 	 	            </div>
				 	 	        </li>
				 	 	        </c:forEach>  
				 	 	        </c:if>
				 	 	    </ul>
				 	 </div>
				 </div>
			</div>
		</div>
		<script type="text/javascript">
			mui.init();
				Zepto(function(){
				$('.trip_tit_d').on('tap',function(event){
					$(this).siblings('.trip-list-box').toggle().parent().siblings().find('.trip-list-box').hide();
					     $(document).on('tap',function(){ //对document绑定一个影藏Div方法
                           $('.trip-list-box').hide();
                          });
                            event.stopPropagation(); //阻止事件向上冒泡
				})		
				$('.trip_tit_n').on('tap',function(){
					    var  txtit=$(this).text();
					    $(this).parent('.trip-list-box').siblings('.trip_tit_d').text(txtit).siblings('.trip-list-box').hide();
					    $('#estday').val(txtit);
					   if($('#estday').val()!=''){
					    	$('#travelRentForm').submit();
					    }
				});
				$('.trip_tit_m').on('tap',function(){
					    var  txtit=$(this).text();
					    $(this).parent('.trip-list-box').siblings('.trip_tit_d').text(txtit).siblings('.trip-list-box').hide();
					    $('#destination').val(txtit);
					    if($('#destination').val()!=''){
					    	$('#travelRentForm').submit();
					    }
				});
				$('.mui-table-view-cell').on('tap',function(){
					  window.location.href = $(this).attr("value");
				});
			})
		</script>
	</body>

</html>